<template>
  <div class="app">
    <div class="swiper">
      <img src="https://ts1.cn.mm.bing.net/th/id/R-C.52c1ee3b9277a982b3a5628068d9246a?rik=jY5Pp9va6tForQ&riu=http%3a%2f%2fp0.itc.cn%2fimages01%2f20201209%2fa84bc1dc148f4631b1880679d771b340.jpeg&ehk=2iZKsboYLSdYJSh2rbo%2f1GZN47WlhpdQ%2fIXClsXSa3s%3d&risl=&pid=ImgRaw&r=0" alt="">
    </div>
  </div>
</template>

<script>
export default {

}
</script>

<style lang="scss" scoped>

.swiper {
  width: 100%;
  position: relative;
}
.swiper::after{
  position: absolute;
  content: '';
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  box-shadow:0px -30px 50px 0px #f5f5f5 inset;
}
.swiper img{
  width: 100%;
  height: 100%;
  display: block;
}
</style>